<template>
  <div>
    <simpleInfoCard title="检查点信息">
      <template slot="contents">
        <div class="contents">
          <el-row>
            <el-col :span="24" class="col">
              <div class="label">活动标题：</div>
              <div class="value">{{ model.title }}</div>
            </el-col>
            <el-col :span="24" class="col">
              <div class="label">活动时间：</div>
              <div class="value">{{ model.dateTime }}</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24" class="col">
              <div class="label">活动内容：</div>
              <div class="value" v-html="content()" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24" class="col">
              <div class="label">附件：</div>
              <div class="value">
                <el-image
                  v-for="(item, index) in model.imgUrls"
                  :key="index"
                  style="width: 100px; height: 100px; margin-right: 6px; margin-bottom: 6px;"
                  :src="item"
                  :preview-src-list="model.imgUrls"
                />
              </div>
            </el-col>
          </el-row>
        </div>
      </template>
    </simpleInfoCard>
  </div>
</template>

<script>
export default {
  data() {
    return {
      model: {}
    }
  }
}
</script>

<style lang="scss" scoped>
.contents{
  padding: 20px 0;
  .col{
    display: flex;
    justify-content: flex-start;
    margin-bottom: 16px;
    .label{
      text-align: right;
      color: #666;
      min-width: 80px;
    }
    .value{
      flex: 1;
      margin-left: 5px;
      color: #333;
    }
  }
}
</style>

